import { createRouter,createWebHashHistory } from "vue-router";
//导入$axios封装
import $axios from "@/utils/request";
//弹窗
import { ElMessage } from "element-plus";


// 1.后台账号跨域访问前后台所有页面    
// 2.前台账号只能访问前台网站
// 3.没有账号可以访问部分前台页面

//给又有设置两个属性：
//requireAuth ： （所有路由）你目前所登录的账号是否有权限访问当前路由（true：该路由必须是后台账号访问：false：该路由前后台账号皆可访问）
//isCheckLogin属性：主要针对前台网页（true：该路由只能登录账号访问：false：该路由不需要登录可直接访问）
const routes = [
   {
    path : '/',
    redirect : '/login'  //当直接访问官网或本地域名时默认重定向到新的登录页
   },
   // 登录和注册路由 - 独立的路由，不再嵌套在Layout中
   {
    path: '/login',
    name: 'UserWebLogin',
    component: () => import('@/view/userWeb/Login.vue'),
    meta: {title: '用户登录', isCheckLogin: false, requireAuth: false}
   },
   {
    path: '/register',
    name: 'UserWebRegister',
    component: () => import('@/view/userWeb/Register.vue'),
    meta: {title: '用户注册', isCheckLogin: false, requireAuth: false}
   },
   
   // 新的网页商城路由
   {
    path : '/userWeb',
    component:()=>import('@/view/userWeb/Layout.vue'),
    meta : {requireAuth:false},
    children : [
        {path : '', redirect: 'index'}, // 当访问 /userWeb 时重定向到 /userWeb/index
        {path : 'index', name:'UserWebIndex', component:()=>import('@/view/userWeb/Index.vue'), meta:{title:'在线商城首页', isCheckLogin:false}},
        {path : 'products', name:'UserWebProducts', component:()=>import('@/view/userWeb/Products.vue'), meta:{title:'全部商品', isCheckLogin:false}},
        {path : 'product/:id', name:'UserWebProduct', component:()=>import('@/view/userWeb/Product.vue'), meta:{title:'商品详情', isCheckLogin:false}},
        {path : 'cart', name:'UserWebCart', component:()=>import('@/view/userWeb/Cart.vue'), meta:{title:'购物车', isCheckLogin:true}},
        {path : 'orders', name:'UserWebOrders', component:()=>import('@/view/userWeb/Orders.vue'), meta:{title:'我的订单', isCheckLogin:true}},
        {path : 'profile', name:'UserWebProfile', component:()=>import('@/view/userWeb/Profile.vue'), meta:{title:'个人信息', isCheckLogin:true}},
        {path : 'category/:id', name:'UserWebCategory', component:()=>import('@/view/userWeb/Category.vue'), meta:{title:'分类商品', isCheckLogin:false}},
        {path : 'search', name:'UserWebSearch', component:()=>import('@/view/userWeb/Search.vue'), meta:{title:'搜索结果', isCheckLogin:false}},
        {path : 'api-test', name:'UserWebApiTest', component:()=>import('@/view/userWeb/APITest.vue'), meta:{title:'API测试', isCheckLogin:false}},
    ]
   },
   //前台网站 : 进入默认访问首页
   {
    path : '/home',
    meta : {requireAuth:false}, //前台商城所有页面皆可用任何账号访问
    //子路由
    children : [
        //设置子路由首页组件的访问地址为空，相当于当访问/home的时候，也会默认访问到该组件页面
        {path : '',name:'HomeIndex',component:()=>import('@/view/home/HomeIndex.vue'),meta:{title:'在线商城首页',isCheckLogin:false}},
        {path : 'login',name:'HomeLogin',component:()=>import('@/view/home/HomeLogin.vue'),meta:{title:'会员登录'},isCheckLogin:false},
        {path : 'cart',name:'HomeCart',component:()=>import('@/view/home/HomeCart.vue'),meta:{title:'会员购物车'},isCheckLogin:true},
    ]
   },
   //后台管理系统 ： 进入默认访问登录页
   {
    path:'/admin',
    children : [
        //设置空路由给登录组件
        {path:'',name:'AdminLogin',component:()=>import('@/view/admin/AdminLogin.vue'),meta:{title:'后台系统登录页'},requireAuth:false},
        {path:'index',name:'AdminIndex',component:()=>import('@/view/admin/AdminIndex.vue'),meta:{title:'后台首页'},requireAuth:true,
        children : [
            {path:'user',name:'AdminUser',component:()=>import('@/view/admin/AdminUser.vue'),meta:{title:'用户管理'},requireAuth:true},
            {path:'goods',name:'AdminGoodsCom',component:()=>import('@/view/admin/AdminGoodsCom.vue'),meta:{title:'订单管理'},requireAuth:true},
            {path:'good',name:'AdminGood',component:()=>import('@/view/admin/AdminGood.vue'),meta:{title:'商品管理'},requireAuth:true},
            {path:'lunbo',name:'LunboCom',component:()=>import('@/view/admin/LunboCom.vue'),meta:{title:'轮播图管理'},requireAuth:true},
            {path:'dingdan',name:'DingdanCom',component:()=>import('@/view/admin/DingdanCom.vue'),meta:{title:'订单管理'},requireAuth:true},
        ]
        },
        
    ]
   }
];

const router = createRouter({
    routes,
    history : createWebHashHistory()
})
//设置全局前置路由守卫
router.beforeEach((to, from, next) => {
  // 登录和注册页面应该可以直接访问
  if (to.path === '/login' || to.path === '/register') {
    next();
    return;
  }
  
  //接收身份数据
  let role;
  //判断即将前往的目录路由是否需要访问权限：如果需要验证则发起角色访问请求：如果不需要，只需要判断是否需要登录前台账号
  if (to.meta.requireAuth === true) {
    //需要验证当前使用者的访问权限
    //向后端发起请求当前使用者角色的数据
    $axios.post('/role').then( (res)=>{
        //判断状态码是否为200===》请求成功
        if ( res.code === '200' ) {
            //获取到了使用者身份

            console.log('您的身份是：'+res.data);
            role = res.data;
            
            //判断当前身份是否是"admin后台管理员"，如果是则是说明已登录账号能访问后台首页
            switch( role  ){
                case 'admin':
                    //有足够的权限访问后台页面
                    next();
                break;
                
                case 'user':
                    //权限不足
                    ElMessage.error('您的权限不足，，请前往商城登录，祝您购物愉快！');
                    //强制跳转登录页
                    next('/home/login')
                break;
            }


        }else{
            //没有获取到身份
            ElMessage.error('您还不是我们的会员，请注册！');
            next('/home/login')
        }
        
    } ).catch( (err)=> console.log(err) )
  } else {
    //不需要权限，只要是个账号都能访问到商城
    //只需要做一个判断，当前路由是否需要登录后才能访问
    if ( to.meta.isCheckLogin === true ) {
        //会话缓存提取数据
        let user = sessionStorage.getItem('user');
        //没有数据
        if ( !user ) {
            // 判断当前路径是否包含userWeb
            if(to.path.includes('/userWeb')) {
                //强制前往新的登录页
                next('/login');
            } else {
                //强制前往原来的登录页
                next('/home/login');
            }
        }else{
            next();
        }
    }else{
        //不要登录，直接进入
        next();
    }
  }
})

//设置全局后置路由守卫，用于设置页面标题
router.afterEach((to) => {
  // 设置页面标题
  if (to.meta.title) {
    document.title = to.meta.title + ' - 在线商城';
  } else {
    document.title = '在线商城';
  }
});

export default router;